/* pages/search-page/search-page.wxss */

/* 搜索栏 */

.search-bar {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    color: #777;
    background: #fff;
    box-shadow: 0 2 rpx 6 rpx rgba(0, 0, 0, 0.07);
    z-index: 3;
}

.search-bar .search-box {
    position: relative;
    height: 60 rpx;
    background: #f7f7f7;
    z-index: 999;
    width: 80%;
    margin-left: 70 rpx;
    border-radius: 50 rpx;
    margin: 20 rpx 0 20 rpx 20 rpx;
}

.sear-input {
    height: 60 rpx;
    border-radius: 50 rpx;
    border: 0;
    margin: 0 30 rpx 0 64 rpx;
    line-height: 48 rpx;
    vertical-align: top;
    background: #f7f7f7;
    font-size: 28 rpx;
}

.search-bar .search-hint {
    font-size: 28 rpx;
    position: absolute;
    right: 30 rpx;
    top: 31 rpx;
    color: #eb2444;
}

.search-bar .search-box .search-img {
    width: 32 rpx;
    height: 32 rpx;
    position: absolute;
    left: 20 rpx;
    top: 14 rpx;
    display: block;
}

/* 热门搜索&搜索历史 */

.search-display {
    background: #fff;
    padding: 20 rpx;
    margin-top: 100 rpx;
}

.search-display .title-text {
    padding: 30 rpx 0;
    font-size: 30 rpx;
    color: #666;
}

.hot-search .hot-search-tags {
    overflow: hidden;
    font-size: 26 rpx;
    text-align: center;
    padding-bottom: 30 rpx;
}

.hot-search .hot-search-tags .tags {
    display: block;
    max-width: 100%;
    overflow: hidden;
    float: left;
    border-radius: 50 rpx;
    white-space: nowrap;
    text-overflow: ellipsis;
    background-color: #f2f2f2;
    box-sizing: border-box;
    margin-right: 20 rpx;
    margin-bottom: 20 rpx;
    padding: 10 rpx 30 rpx;
}

/* 搜索历史 */

.history-search .title-text.history-line {
    position: relative;
    border-top: 2 rpx solid #e1e1e1;
}

.history-search .his-search-tags {
    overflow: hidden;
    font-size: 26 rpx;
    text-align: center;
    display: inline-block;
}

.history-search .his-search-tags .tags {
    max-width: 300 rpx;
    overflow: hidden;
    float: left;
    border-radius: 50 rpx;
    white-space: nowrap;
    text-overflow: ellipsis;
    background-color: #f2f2f2;
    box-sizing: border-box;
    margin-right: 20 rpx;
    margin-bottom: 20 rpx;
    padding: 10 rpx 30 rpx;
}

.clear-history image {
    width: 32 rpx;
    height: 32 rpx;
    position: absolute;
    right: 10 rpx;
    top: 30 rpx;
}

.search-tit-empty {
    display: block;
    margin: 0 auto;
    text-align: center;
    width: 100%;
    font-size: 24 rpx;
    color: #aaa;
}
